import _objectSpread from "@babel/runtime/helpers/esm/objectSpread2";
import _classCallCheck from "@babel/runtime/helpers/esm/classCallCheck";
import _createClass from "@babel/runtime/helpers/esm/createClass";
import _inherits from "@babel/runtime/helpers/esm/inherits";
import _createSuper from "@babel/runtime/helpers/esm/createSuper";
import React, { PureComponent } from 'react';
import isAbsoluteUrl from 'is-absolute-url'; // import { isEmpty } from 'lodash';

import { Editor } from '@tinymce/tinymce-react'; // import loadScript from 'load-script';

import request from "../../utils/request";
import { getEnvConfig } from "../../utils/iocUtils";
import notification from "../../utils/notification";
import { getAttachmentUrl, getCurrentLanguage } from "../../utils/utils"; // Import TinyMCE

import 'tinymce/tinymce.min';
import 'tinymce/themes/modern/theme.min'; // Any plugins you want to use has to be imported

import 'tinymce/plugins/paste';
import 'tinymce/plugins/link';
import 'tinymce/plugins/table';
import 'tinymce/plugins/image';
import 'tinymce/plugins/imagetools';
import 'tinymce/plugins/preview';
import 'tinymce/plugins/code';
import 'tinymce/plugins/codesample';
import 'tinymce/plugins/textcolor';
import 'tinymce/plugins/fullscreen';
import 'tinymce/plugins/lists';
import 'tinymce/plugins/template'; // import 'tinymce/plugins/pagebreak';

import 'tinymce/plugins/searchreplace'; // import 'tinymce/plugins/toc';
// import 'tinymce/plugins/anchor';

import 'tinymce/plugins/print'; // import './skins/lightgray/skin.min.css';

import "./content.min.css";
import RichTextInsertFile from "./RichTextInsertFile"; // A theme is also required
// import 'tinymce/themes/modern/theme';

var TinymceEditor = /*#__PURE__*/function (_PureComponent) {
  _inherits(TinymceEditor, _PureComponent);

  var _super = _createSuper(TinymceEditor);

  function TinymceEditor() {
    var _this;

    _classCallCheck(this, TinymceEditor);

    for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {
      args[_key] = arguments[_key];
    }

    _this = _super.call.apply(_super, [this].concat(args));
    _this.state = {
      uploadFileModalvisible: false
    };
    _this.config = getEnvConfig();
    return _this;
  }

  _createClass(TinymceEditor, [{
    key: "componentDidMount",
    value: function componentDidMount() {// const language = getCurrentLanguage();
      // if (language !== 'en_US' && isEmpty(window.tinymce.i18n.data[language])) {
      //   import(`./locale/${language}.js`);
      // }
    }
  }, {
    key: "imagesUploadHandler",
    value: function imagesUploadHandler(blobInfo, success, failure) {
      var _this$props = this.props,
          _this$props$bucketNam = _this$props.bucketName,
          bucketName = _this$props$bucketNam === void 0 ? this.config.BKT_PUBLIC : _this$props$bucketNam,
          _this$props$bucketDir = _this$props.bucketDirectory,
          bucketDirectory = _this$props$bucketDir === void 0 ? 'editor' : _this$props$bucketDir;
      var formData = new FormData();
      formData.append('file', blobInfo.blob(), 'blob.png');
      formData.append('bucketName', bucketName);
      formData.append('directory', bucketDirectory);
      formData.append('fileName', 'blob.png');
      request("".concat(this.config.CPAAS_FILE, "/v1/files/multipart"), {
        processData: false,
        method: 'POST',
        type: 'FORM',
        body: formData,
        responseType: 'text'
      }).then(function (res) {
        if (isAbsoluteUrl(res)) {
          success(getAttachmentUrl(res, bucketName, undefined, bucketDirectory));
          notification.success();
        } else {
          failure(JSON.parse(res).message);
          notification.error({
            message: JSON.parse(res).message
          });
        }
      });
    }
  }, {
    key: "handleOnChange",
    value: function handleOnChange(event) {
      var _this$props$onChange = this.props.onChange,
          onChange = _this$props$onChange === void 0 ? function (e) {
        return e;
      } : _this$props$onChange;
      onChange(event.target.getContent());
    }
  }, {
    key: "editorSetup",
    value: function editorSetup(editor) {
      editor.addButton('insertFile', {
        icon: 'upload',
        tooltip: 'Insert File',
        onclick: this.setUploadFileModalvisible.bind(this)
      });
    }
  }, {
    key: "setUploadFileModalvisible",
    value: function setUploadFileModalvisible() {
      var uploadFileModalvisible = this.state.uploadFileModalvisible;
      this.setState({
        uploadFileModalvisible: !uploadFileModalvisible
      });
    }
  }, {
    key: "uploadFileModalOk",
    value: function uploadFileModalOk(content) {
      this.tinymceEditor.editor.insertContent(content);
    }
  }, {
    key: "render",
    value: function render() {
      var _this2 = this;

      var _this$props2 = this.props,
          content = _this$props2.content,
          _this$props2$bucketNa = _this$props2.bucketName,
          bucketName = _this$props2$bucketNa === void 0 ? this.config.BKT_PUBLIC : _this$props2$bucketNa,
          _this$props2$bucketDi = _this$props2.bucketDirectory,
          bucketDirectory = _this$props2$bucketDi === void 0 ? 'editor' : _this$props2$bucketDi;
      var uploadFileModalvisible = this.state.uploadFileModalvisible;
      var language = getCurrentLanguage();
      var languageConfig = language !== 'en_US' ? {
        language: language,
        language_url: "".concat(process.env.BASE_PATH || '/', "lib/tinymce/skins/langs/").concat(language, ".js")
      } : {};
      var richTextInsertFileProps = {
        bucketName: bucketName,
        bucketDirectory: bucketDirectory,
        visible: uploadFileModalvisible,
        onOk: this.uploadFileModalOk.bind(this),
        onCancel: this.setUploadFileModalvisible.bind(this)
      };
      return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(Editor, {
        ref: function ref(_ref) {
          _this2.tinymceEditor = _ref;
        },
        value: content,
        init: _objectSpread({
          target: this.editor,
          plugins: ['paste', 'link', 'table', 'image', 'imagetools', 'preview', 'code', 'codesample', 'textcolor', 'fullscreen', 'lists', 'template', // 'pagebreak',
          'searchreplace', // 'toc',
          // 'anchor',
          'print'],
          toolbar: 'undo redo | formatselect fontselect | alignleft aligncenter alignright alignjustify | bold italic strikethrough forecolor backcolor | link image insertFile | numlist bullist outdent indent  | removeformat fullscreen',
          images_upload_handler: this.imagesUploadHandler.bind(this),
          min_height: 500,
          setup: this.editorSetup.bind(this),
          skin_url: "".concat(process.env.BASE_PATH || '/', "lib/tinymce/skins/lightgray")
        }, languageConfig),
        onChange: this.handleOnChange.bind(this)
      }), /*#__PURE__*/React.createElement(RichTextInsertFile, richTextInsertFileProps));
    }
  }]);

  return TinymceEditor;
}(PureComponent);

export { TinymceEditor as default };